let top_ul = document.getElementsByClassName("top_ul")[0];
let class_con = document.getElementsByClassName("class_con")[0];
let boke_con = document.getElementsByClassName("boke_con")[0];
$.ajax({
    type: "GET",
    url: `/api/class/init`,
    success(data) {
        for (let index = 0; index < data.length; index++) {
            top_ul.innerHTML +=
                `<li id="${data[index].id}" onclick="classify(this)">${data[index].labelClass}</li>`
        }
    }
})
                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                            
function classify(obj) {
    $.ajax({
        type: "GET",
        url: `/api/class/classify`,
        data: {
            id: obj.id
        },
        success(data) {
            console.log(data);
            top_ul.innerHTML = ""
            if (data.Blogs.length == 0) {
                top_ul.innerHTML += `<li>此标签没有任何博客</li>`
            } else {
                for (let index = 0; index < data.Blogs.length; index++) {
                    top_ul.innerHTML +=
                        `<li id="${data.Blogs[index].id}" onclick="blogDetails(this)">${data.Blogs[index].label}</li>`
                }
            }

            top_ul.innerHTML += `<li onclick="fanhui()">返回</li>`
        }
    })
}

function blogDetails(obj) {
    $.ajax({
        type: "GET",
        url: `/api/blog/blogDetails`,
        data: {
            id: obj.id
        },
        success(data) {
            let biaoqianHTML = "";
            for (let i = 0; i < data.Classes.length; i++) {
                biaoqianHTML += `<span>${data.Classes[i].labelClass}</span>`;
            }
            top_ul.style.display = "none";
            boke_con.style.display = "block";
            boke_con.innerHTML = `
                    <div class="details">
                    <div class="btnDel" onclick="btnDel()">←返回</div>
                    <h1>${data.label}</h1>
                    <div class="p">${data.abstract}</div>
                    <div class="biaoqian">
                        <div>
                            <span>发布时间：<span>${data.time}</span></span>
                            <span>浏览量：<span>${data.visitsNum}</span></span>
                        </div>
                        <div>
                            ${biaoqianHTML}
                        </div>
                    </div>
                    <div class="details_con">
                        ${data.blog}
                    </div>
                </div>`
                let scr = document.createElement("script");
                scr.src = "../js/prism.js"
                scr.className = "src";
                document.body.appendChild(scr);
        }
    })
}

function btnDel() {
    top_ul.style.display = "block";
    boke_con.style.display = "none";
    document.getElementsByClassName("src")[0].remove();
}

function fanhui() {
    location.reload();
}